import { Component, OnInit, Output, EventEmitter, AfterViewInit, Input, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
import { DragDrop } from '@angular/cdk/drag-drop';
import { RepairService } from '../repair.service';


@Component({
  selector: 'app-static-result',
  templateUrl: './static-result.component.html',
  styleUrls: ['./static-result.component.scss']
})
export class StaticResultComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {

  isShowContent = true;
  flag = 0;
  @Input() showstaticpanel = false;
  @Input() depthtabledata = null;
  @Input() depthbardata = null;
  @Input() tabledata = null;
  @Input() bardata = null;
  @Input() radioValue = '管点';

  constructor(
    private dragDrop: DragDrop,
    private repairService: RepairService
  ) { }

  ngOnInit() {
  }

  ngAfterViewInit() {
    const dom = document.getElementById('static-panel');
    const dragModal = this.dragDrop.createDrag(dom);
    const title = document.getElementById('static-resTitle');
    // 设置句柄为title，即仅头部可拖动，避免内容中鼠标无法选中的情况
    dragModal.withHandles([title]);
    // 限制拖拽区域在body中，防止溢出
    const domRouter = document.getElementById('contentRouter');
    dragModal.withBoundaryElement(domRouter);
  }

  closePanel() {
    this.showstaticpanel = false;
    this.repairService.closePanel(this.showstaticpanel);
  }

  hidePanel() {
    this.isShowContent = !this.isShowContent;
    if (!this.isShowContent) {
      document.getElementById('overlap').style.transform = 'rotate(0deg)';
    } else {
      document.getElementById('overlap').style.transform = 'rotate(180deg)';
    }
  }

  ngOnChanges(changes: SimpleChanges) {
    // 只要表格有数据，图表就一定有数据，所以直接判断表格就行！
    if (changes.depthtabledata && (changes.depthtabledata.currentValue)) {
      if (this.flag !== 2) {
        this.flag = 2;
      }
    } else if (changes.tabledata && changes.tabledata.currentValue){
      if (this.flag !== 2) {
        this.flag = 2;
      }
    }else{
      this.flag = 1;
    }
  }

  ngOnDestroy() {
    this.flag = 0;
    this.showstaticpanel = false;
    this.isShowContent = true;
  }

}
